<template>
  <div>
    <Header></Header>
    <div class="banner_bg">
			<img class="" src="http://image.utea88.com/statics/pc_finance_banner.png" alt="">
    </div>
    <div class="section_01">
      <div class="wrapper">
        <div class="box">
          <img src="http://image.utea88.com/statics/pc_finance_icon_01.png" alt />
          <div class="title">额度高</div>
        </div>
        <div class="box">
          <img src="http://image.utea88.com/statics/pc_finance_icon_02.png" alt />
          <div class="title">费率低</div>
        </div>
        <div class="box">
          <img src="http://image.utea88.com/statics/pc_finance_icon_03.png" alt />
          <div class="title">手续简</div>
        </div>
        <div class="box">
          <img src="http://image.utea88.com/statics/pc_finance_icon_04.png" alt />
          <div class="title">审批快</div>
        </div>
        <div class="box">
          <img src="http://image.utea88.com/statics/pc_finance_icon_05.png" alt />
          <div class="title">放款快</div>
        </div>
      </div>
    </div>
    <div class="section_02">
      <div class="remark" v-if="remark" v-html="remark"></div>
    </div>
    <Footer></Footer>
  </div>
</template>

<script>
  import Header from "@/views/front/components/Header";
  import Footer from "@/views/front/components/Footer";
  import { advisementByCode } from "@/api/front-home.js";

export default {
  name: "",
  props: {

  },
  components: {
    Header,
    Footer,
  },
  data() {
    return {
      remark: {},
    }
  },
  computed: {

  },
  watch: {},
  methods: {
    getData() {
      advisementByCode("financeAbout").then((res) => {
        let regex = new RegExp('<img', 'gi')
        this.remark = res.remark.replace(regex, '<img style="max-width: 100%;" ');;
      });
    },
  },
  created() {
    this.getData();
  },
  mounted() {
    
  },
  beforeCreate() {}, // 生命周期 - 创建之前
  beforeMount() {}, // 生命周期 - 挂载之前
  beforeUpdate() {}, // 生命周期 - 更新之前
  updated() {}, // 生命周期 - 更新之后
  beforeDestroy() {}, // 生命周期 - 销毁之前
  destroyed() {}, // 生命周期 - 销毁完成
  activated() {}, // 如果页面有keep-alive缓存功能，这个函数会触发
}
</script>

<style lang='scss' scoped>
  .section_01 {
    position: relative;
		width: 100%;
		height: 300px;
    background: rgb(244, 247, 250);

    .wrapper {
      @include abs-center;
      display: flex;
      justify-content: space-around;
      align-items: center;
      width: 1300px;
      height: 100%;
      background: rgb(244, 247, 250);

      .box {
        position: relative;
        width: 110px;
        height: 172px;

        img {
          position: relative;
          width: 110px;
          height: 110px;
        }

        .title {
          margin-top: 30px;
          width: 100%;
          height: 32px;
          font-size: 24px;
          line-height: 24px;
          text-align: center;
        }
      }
    }
  }

  .section_02 {
    position: relative;
    display: flex;
    justify-content: center;
		width: 100%;
    background: white;

    .remark {
      margin-top: 60px;
      margin-bottom: 60px;
      width: 1300px;
    }
  }
</style>